<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
		<script type="text/javascript" src="jquery.js"></script>
		<script type="text/javascript" src="jquery.fieldselection.js"></script>
		<script type="text/javascript" src="jquery.mousewheel.min.js"></script>
		<script type="text/javascript" src="jquery.smart-calendar.js"></script>
		<title>Untitled Document</title>
		<script type="text/javascript">
			$(function(){
				var $date = $('#date').smartCalendar({
					format : 'yyyy/MM/dd HH:mm:ss',
					max : {
						caculate : function(){
							return $('#date2').smartCalendar('getTime');
						}
					}
				});
				var $date = $('#date2').smartCalendar({
					format : 'hello yyyy-MM-dd HH:mm:ss world!',
					min : {
						caculate : function(){
							return $('#date').smartCalendar('getTime');
						}
					}
				});
				$('#now').click(function(){
					$('#time').smartCalendar('setTime', new Date());
				});
				$('#time').smartCalendar({
				    format : 'HH:mm:ss',
					time : new Date(2011, 2, 20, 14, 0, 0),
					step : {
						second : 5
					}
				});
			});
		</script>
	</head>
	<body>
	<h1>jQuery smart-calendar plugin</h1>
	<h3>A jQuery date and time plugin which support mouse-wheel and keyboard control</h3>

<h3><a name="Demo_Code_:"></a>Demo Code :</h3>
<p> From <input id='date' style='width:300px; cursor:pointer' autocomplete='off'> To <input id='date2' style='width:300px' autocomplete='off'></p>
<pre>$('#date').smartCalendar({
    format : 'yyyy/MM/dd HH:mm:ss',
    max : {
        caculate : function(){
            return $('#date2').smartCalendar('getTime');
        }
    }
});</pre>
<h3><a name="Only_time_:"></a>Only time :</h3>
<input id='time' style='width:300px; cursor:pointer' autocomplete='off'> <a id='now' href="javascript:">now</a>
<pre>$('#time').smartCalendar({
    format : 'HH:mm:ss',
	time : new Date(2011, 2, 20, 14, 0, 0),
	step : {
		second : 5
	}
});</pre>
<h3><a name="Demo:"></a>Demo:</h3>
<a rel="nofollow" href="http://code.google.com/p/jquery-smart-calendar/source/browse/trunk/test.html">http://code.google.com/p/jquery-smart-calendar/source/browse/trunk/test.html</a>
<h3><a name="Download"></a>Download</h3>
<a rel="nofollow" href="http://code.google.com/p/jquery-smart-calendar/downloads/list">http://code.google.com/p/jquery-smart-calendar/downloads/list</a>

<span style="color: #808080;"><em> </em></span>
		
		
		<br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/>
	</body>
</html>
